<template>
	<view class="business show">
		<view class="title-h1">
			充电宝支持以下接口类型
		</view>
		<view class="title-h1-desc">
			提示：充电宝自带充电线
		</view>
		<view class="interface-box">
			<block v-for="(m,i) of interface" :key="i">
				<view class="row-box">
					<view class="label">{{ m.label }}</view>
					<view class="icon border">

					</view>
				</view>
			</block>
		</view>
		<view class="list-box">
			<view class="title-h2">
				计费规则
			</view>
			<block v-for="(item,index) in descArr" :key="index">
				<view class="list-title flex ">
					<view class="">
						{{ item.title }}
					</view>
					<view v-if="item.desc">
						{{ item.desc }}
					</view>
				</view>
				<view class="list-desc">
					{{ item.value }}
				</view>
			</block>
			<view class="desc-text" @click="isCheck = !isCheck">
				<view v-if="isCheck" class="icon cuIcon-roundcheckfill"></view>
				<view v-else class="icon cuIcon-round"></view>
				<view class="">
					请阅读并同意
					<!-- 租借充电宝即代表您同意 -->
				</view>
				<view class="a">
					《共享充电宝租赁服务协议》
				</view>
			</view>
		</view>
		<view class="flex align-center justify-center">
			<button @click="onSubmit()" class="tj-btn cu-btn round">立即租借</button>
		</view>
	</view>
</template>

<script>
	export default {
		data() {
			return {
				interface: [ //
					{
						icon: '',
						label: '任意接口',
					},
					{
						icon: '',
						label: 'iPhone',
					},
					{
						icon: '',
						label: 'Android',
					},
					{
						icon: '',
						label: 'Type-C',
					}
				],

				descArr: [
					{
						title: '分时计费',
						desc: '2元/1小时',
						value: '自借出后开始计时，前5分钟内免费；超出部分按每1小时2元计费，不足1小时按1小时计算；每24小时20元封顶；',
					},
					{
						title: '押金规则',
						desc: '',
						value: '租借充电宝前需要缴纳99元押金，芝麻信用550分以上用户有机会免押金。充电宝归还后，押金随时可以在“个人中心-我的钱包”提现。当租借时间过长，租金达到99元时，将自动扣除押金；',
					}
				],
				
				isCheck: false,

			}
		},
		methods: {
			onSubmit() {
				uni.showModal({
					title: '押金充值提示',
					content: '请先充值押金，归还充电宝后可在“个人中心-押金”中提现押金',
					confirmText: '充值押金',
					cancelText: '关闭',
					success: function (res) {
						if (res.confirm) {
							console.log('用户点击确定');
						} else if (res.cancel) {
							console.log('用户点击取消');
						}
					}
				});
			}
		}
	}
</script>

<style scoped lang="scss">
	@import "./business.scss";
</style>